/* 学习目标：掌握-使用subscribe函数，监听store数据的变化  */
// 作用： 监听store中数据的变化
// 语法： const 解除监听的函数 = store.subscribe(() => {})
import { legacy_createStore as createStore } from 'redux';

function xxxReducer(state = { count: 0, msg: 'hello' }, action) {
  if (action.type === 'add') {
    return {
      ...state,
      count: state.count + 1,
    };
  }

  if (action.type === 'des') {
    return {
      ...state,
      count: state.count - 1,
    };
  }
  return state;
}

const store = createStore(xxxReducer);

store.dispatch({ type: 'add' });
store.dispatch({ type: 'add' });
store.dispatch({ type: 'add' });
store.dispatch({ type: 'add' });

// 💥💥 只要开启监听后修改的数据，才会被监听到， 代码都是同步的
const unFn = store.subscribe(() => {
  // 会在数据变化时，自动执行
  console.log('store.getState()  ----->  ', store.getState());
});

store.dispatch({ type: 'add' });
store.dispatch({ type: 'add' });
store.dispatch({ type: 'des' });
store.dispatch({ type: 'des' });

// 💥💥 解除监听之前修改的数据，才会被监听到， 原因： 代码都是同步的
unFn();
